<template>
  <section>
    <ul>
      <li v-for="(item, index) in items" :key="index">{{item.message}}</li>
    </ul>
    <ul>
      <li
        v-for="(item, index) in items"
        :key="index"
      >{{parentMessage}} - {{index}} - {{item.message}}</li>
    </ul>
    <ul>
      <li v-for="(item, index) of items" :key="index">{{item.message}}</li>
    </ul>
  </section>
</template>

<script>
export default {
  name: "Vfor",
  data() {
    return {
      parentMessage: "Parent",
      items: [{ message: "Foo" }, { message: "Bar" }]
    };
  }
};
</script>